<template>
<div class="newUser">
	<div class="topTit">
		<h4>{{ status == 3 || status == 2 ? '修改' : '忘记'}}{{ txt }}密码？</h4>
		<h1>请输入要找回的账号</h1>
	</div>
	<div class="con">
		<p v-if="!(status == 2)">用户编号</p>
		<label v-if="!(status == 2)">
			<input type="text" placeholder="请您输入用户编号" v-model="userCode" oninput="if(value.length>11)value=value.slice(0,11)" >
		</label>
		<p>手机号</p>
		<label>
			<input type="number" placeholder="请您输入手机号" v-model="phone" oninput="if(value.length>11)value=value.slice(0,11)" >
		</label>
		<p>验证码</p>
		<div class="label">
			<input type="text" placeholder="请您输入验证码" v-model="code">
			<input type="button" :disabled='phone.length < 11 || codeIsSend' @click='sendCode()' :value="codeTxt" class="code">
		</div>
		<p>新{{ txt }}密码</p>
		<label>
			<input type="password" :placeholder="'请输入新'+ txt +'密码'" v-model="newPass">
		</label>
		<p>确认新{{ txt }}密码</p>
		<label>
			<input type="password" :placeholder="'再次输入新'+ txt +'密码'" v-model="confirmPass">
		</label>

		<input type="button" value="确定修改" :disabled=' !isSubmit ' :class="{active: isSubmit }" class="submit" @click='next'>
	</div>

</div>
</template>

<script>
import { sendCode, phoneSendCode, editLoginPass } from '../../config/getData.js'

export default {
	data(){
		return {
			phone:'',
			userCode:'',
			code:'',
			codeTxt:'获取验证码',
			num:60,
			codeIsSend: false,
			newPass:'',
			confirmPass:'',
			txt:'登录',
			type:-1
		}
	},
	computed: {
		status(){
			// console.log()
			return this.$route.params.status
		},
		isSubmit(){
			return this.phone.length >= 11 && this.code.length >= 4
		}
	},
	created(){
		console.log(this.status)
		if(this.status == 1 || this.status == 2){
			this.txt = '登录'
			this.type = 1
		}else if(this.status == 3){
			this.txt = '交易'
			this.type = 2
		}

	},
	methods: {
		sendCode(){
			var that = this;
			this.codeIsSend = true
			var userCode = this.status == 1 ? this.userCode : JSON.parse( localStorage.userInfo )['user_login'];

			sendCode(userCode,this.phone).then( res => {
				this.$vux.toast.show({
					text: res.msg,
					width:'auto',
				})

				if(res.code == 1){
					that.codeTxt = that.num + 's 重发';
					var codeInter = setInterval(function(){
						that.num--;
						that.codeTxt = that.num + 's 重发'
						if(that.num <= 0) {
							clearInterval(codeInter);
							that.codeTxt = '再次获取';
						}
					},1000)
				}else{
					this.codeIsSend = false;
				}
			})

			return ;
		},
		next(){
			var userCode = this.status == 1 ? this.userCode : JSON.parse( localStorage.userInfo )['user_login'];

			editLoginPass(userCode,this.phone,this.newPass,this.confirmPass, this.code, this.type).then( res => {
				this.$vux.toast.show({
					text: res.msg,
					type:'success',
				})
				this.$router.go(-1)
			})
			// this.$router.push('/newPass')
		}
	}
}
</script>


<style lang="scss">
@import '../../assets/css/all';
@import '../../assets/css/login';

.newUser .con{
	p {margin-top:20px;}
	.label .code{padding:0 15px;float:right;height: 35px;font-size:12px;background-color: white;border:1px solid #ddd;}
}
</style>

